<!DOCTYPE html>
<%@ page language="java" pageEncoding="UTF-8"%>
<html lang="en">

<head>
    <meta charset="utf-8">
    <%@include file="head.jsp"%>
    <title> 登录</title>
    <link href="<%=basePath%>/resources/css/login.css" rel="stylesheet">
    <link href="<%=basePath%>/resources/css/my.css?v=1" rel="stylesheet" />
    <script src="<%=basePath%>/resources/js/gt.js"></script>
    <style>
    	.form-control, .single-line{width:100%;}
    </style>
</head>
<body class="signin">
    <div class="signinpanel text-center">
        <div class="row">
        	<div class="col-sm-7">
        		<div class="logopanel m-b">
                   <img src="<%=basePath%>/resources/img/d-logo.png" style="margin-top:100px;width:400px;"/>
                </div>
        	</div>
            <div class="col-sm-5">
                <div class="signin-info">
                    <div class="m-b"></div>
                    <h2>统一认证管理平台</h2>                    
                </div>
                <form method="post" action="index.html" style="width:360px;margin:0 auto;" >
                    <input type="text" class="form-control uname" style="width:300px;" id="username" placeholder="用户名" />
                    <input type="password" class="form-control pword m-b" style="width:300px;" id="password" placeholder="密码" />
                    <div id="captcha"></div>
                    <button class="btn btn-success btn-block" style="width:300px;" type="button" id="submit">登录</button>
    				<div style="margin-top:5px;"><p id="notice"></p></div>   
                </form>
            </div>
        </div>
        <div class="signup-footer" style="text-align:center;">
            <div class="pull-center" >
                &copy; 上海德慧信息技术有限公司版权所有
            </div>
        </div>
    </div>
</body>
<script>
	var handler = function (captchaObj) {
		$("#submit").click(function (e) {
			var result = captchaObj.getValidate();
            if (!result) {
            	$("#notice").html("请先完成验证");
            } else {
                $.ajax({
                	url: 'login',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                    	username: $('#username').val(),
                        password: $('#password').val(),
                        geetest_challenge: result.geetest_challenge,
                        geetest_validate: result.geetest_validate,
                        geetest_seccode: result.geetest_seccode
                    },
                    success: function (data) {
                        if (data.status === 'success') {
                            alert(data.msg);
                        } else if (data.status === 'fail') {
                        	$("#notice").html(data.msg);
                            //alert(data.msg);
                        }
                    }
                })
            }
            e.preventDefault();
        });
        // 将验证码加到id为captcha的元素里，同时会有三个input的值用于表单提交
        captchaObj.appendTo("#captcha");
        // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
    };
        
    $.ajax({
        url: "login?t=" + (new Date()).getTime(), // 加随机数防止缓存
        type: "get",
        dataType: "json",
        success: function (data) {
            // 调用 initGeetest 初始化参数
            // 参数1：配置参数
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它调用相应的接口
            initGeetest({
                gt: data.gt,
                challenge: data.challenge,
                new_captcha: data.new_captcha, // 用于宕机时表示是新验证码的宕机
                offline: !data.success, // 表示用户后台检测极验服务器是否宕机，一般不需要关注
                product: "float", // 产品形式，包括：float，popup
                width: "100%"
                // 更多配置参数请参见：http://www.geetest.com/install/sections/idx-client-sdk.html#config
            }, handler);
        }
    });
</script>
</html>
